<template  name='diy'>
	<view class="footer">
		<view @click="link('/pages/index/index')" class="item">
			<text class="iconfont icon-homepage"></text>
			<text class="f">主页</text>
		</view>
		<view @click="link('/pages/chat/liaotian')">
			<text class="iconfont icon-ziyuan"></text>
			<text class="f">消息</text>
		</view>
		<view  @click="link('/pages/service/person_service')">
			<text class="iconfont icon-tianping"></text>
			<text class="f">法务</text>
		</view>
		<view class="on" @click="link('/pages/user/index')">
			<text class="iconfont icon-my"></text>
			<text class="f">我的</text>
		</view>
	</view>
</template>

<script>
	export default {
		name:'diy',
		methods:{
			link(n) {
				uni.navigateTo({
					url: n,
					animationType: 'pop-in',
					animationDuration: 200
				})
			}
		}
	}
</script>
<style lang="scss">
	.footer{
		overflow: hidden;
		width: 666rpx;
		height: 100rpx;
		box-shadow: 0px 3px 7px 0px rgba(113,112,112,0.25);
		background: #F8F8F8;
		border-radius: 20rpx;
		position: fixed;
		left: 50%;
		z-index: 99999999;
		display: flex;
		align-items: center;
		margin-left: -333rpx;
		bottom: 25rpx;
		view{
			width: 25%;
			float: left;
			&.on text{
				color: #DBAC53;
			}
			.iconfont{
				font-size: 38rpx;
				margin: 0 auto;
				text-align: center;
				color: #6D7278;
				display: block;
				margin-bottom: 6rpx;
			}
			.f{
				font-size: 20rpx;
				color: #333;
				display: block;
				text-align: center;
			}
		}
	}
</style>
